<template>
  <div class="newsdetail">
    <div class="nd-title">{{ news.title }}</div>
    <div class="nd-time">{{ news.createTime }}</div>
    <div class="nd-content" v-html="news.content"></div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        id: this.$route.query.id,
        news: {}
      }
    },
    created() {
      this.getNewsDetail()
    },
    methods: {
      getNewsDetail() {
        this.$http.get(`/news/${this.id}/`).then(res => {
          this.news = res.data
        })
      }
    }
  }
</script>

<style lang="less" scoped>
.newsdetail{
  padding: .2rem .3rem;
  .nd-title{
    font-size: .2rem;
    line-height: 1.5;
    text-align: center;
    margin-bottom: .2rem;
    color: #101010;
  }
  .nd-time{
    font-size: .14rem;
    text-align: center;
    margin-bottom: .2rem;
    color: #999;
  }
  .nd-content{
    font-size: .15rem;
    line-height: 1.3;
    color: #333;
  }
}
</style>